<template>
	<view>
		<view class="xq-img">
			<image class="xqpic" :src="data.picture" mode="widthFix"></image>
		</view>
		<view class="anquan">
			<view :class="'xq-title fontsize'+fontsizenub" >{{data.title}}</view>
			<view  :class="'xq-otr fontsize'+fontsizenub">
				发布时间：{{data.updateTime}}
			</view>
			<view>
				<wxParse :className="'xq-cont fontsize'+fontsizenub" :content="data.content" @preview="preview" @navigate="navigate" />
			</view>
		</view>
		<view class="share" v-show="isshowshare">
			<view class="sharebox">
				<view class="sharetodo" @click="sharewx('WXSceneSession')">微信</view>
				<view class="sharetodo" @click="sharewx('WXSenceTimeline')">微信朋友圈</view>
			</view>
			<view class="close" @click="closeshare">关闭</view>
		</view>
		<view class="fixed">
			<view class="shenbao" v-if="data.status == 0" @click="baoming">我要报名参会</view>
			<view class="shenbao otrs"  v-else>报名已结束</view>
			
		</view>
	</view>
</template>

<script>
	import {common} from '@/common/publish.js';
	import {mapState,mapMutations} from 'vuex';
	import wxParse from 'mpvue-wxparse'
	export default {
		components:{
			wxParse
		},
		data() {
			return {
				type:'',
				id:'',
				data:{},
				isshowshare:false,
				href:''
			};
		},
		onLoad(event) {
			
				this.getlist(event.id)
		},
		methods: {
			preview(src, e) {
			  // do something
			  console.log('do something')
			},
			navigate(href, e) {
			   uni.navigateTo({
			   	url: '/pages/webview/webview?url='+href
			   });
			},
			//课程
			getlist:function(id){
				uni.request({
					url: common.localurl+'/api/meeting/detail.json', 
					data:{meetingId:id},
					method:'GET',
					dataType:'json',
					success: (res) => {
						this.data = res.data;
						this.data.updateTime = common.format(this.data.time)
						this.data.picture = common.localurl+this.data.picture;
						var href = 'http://nbnet.chinaecdc.com/api/meetingdetail.htm?meetingId='+ id;
						this.abouttitle(this,href)
					}
				});
			},
			abouttitle:function(that,href){
				that.href = href
				uni.setNavigationBarTitle({
					title: that.data.title
				});
			},
			baoming(){
				var that = this;
				uni.getStorage({
					key: 'islogin',
					success: function (res) {
						if(res.data == true){
							uni.navigateTo({
								url: '/pages/meetingform/meetingform?query='+ encodeURIComponent(JSON.stringify(that.data))
							});
						}else{
							uni.showToast({
								title: '此模块需要登陆',
								icon:'none',
								duration: 1500
							});
						}
					},
					complete: (res) => {
						uni.showToast({
							title: '此模块需要登陆',
							icon:'none',
							duration: 1500
						});
					}
				});
				
			},
			sharewx(who){
				var that = this;
				uni.getProvider({
					service: 'share',
					success: function (res) {
						console.log(JSON.stringify(res));
						if (~res.provider.indexOf('weixin')) {
							uni.share({
								provider: "weixin",
								scene: who,
								type: 0,
								href: that.href,
								title: '教育之弦',
								summary: that.data.title,
								imageUrl: common.localurl+"/assets/front/image/jyzxlogo.jpg",
								success: function (res) {
									console.log("success:" + JSON.stringify(res));
									that.isshowshare =false;
								},
								fail: function (err) {
									console.log("fail:" + JSON.stringify(err));
								}
							});
						}
					}
				});
				
			},
			closeshare(){
				this.isshowshare =false;
			},
			showshare(){
				this.isshowshare =true;
			}
		},
		computed:{
			...mapState(['fontsizenub'])
		}
	}
</script>

<style lang="scss">
	@import '@/common/publish.scss';
	@include fontsizefn(".xq-title",36upx);
	@include fontsizefn(".xq-otr",30upx);
	@include fontsizefn(".xq-cont",36upx);
	page{
		background-color: $bgcolor;
	}
	.xq-img{
		width:750upx;
	}
	.xqpic{
		width:100%;
	}
	.anquan{
		padding:0 24upx;
	}
	.xq-title{
		line-height:60upx;
		color:$titlecolor;
	}
	.xq-otr{
		color:$timecolor;
		line-height:50upx;
	}
	.xq-cont{
		margin-bottom:80upx;
	}
	.boot{
		position:fixed;
		left:0;
		bottom:0;
		width:750upx;
		height:120upx;
		display: flex;
		flex-direction:row;
		flex-wrap:nowrap ;
		justify-content:space-between;
		align-items:flex-start;
		line-height:120upx;
		background-color:#fff;
		border-top:1px solid #fbfbfb;
		z-index:10;
	}
	.bootchild{
		text-align:center;
		width:33.3%;
	}
	.share{
		position:fixed;
		left:0;
		bottom:0;
		height:300upx;
		width:750upx;
		background-color:#fff;
		border-top:1px solid #fbfbfb;
		z-index:11;
	}
	.sharebox{
		width:100%;
	}
	.sharetodo{
		width:750upx;
		height:100upx;
		line-height:100upx;
		font-size:32upx;
		color:$fontblue;
		text-align: center;
		border-bottom:1px solid #ccc;
	}
	.fixed{
		position:fixed;
		left:0;
		bottom:0;
		width:750upx;
		height:80upx;
		background-color: #ccc;
	}
	.shenbao{
		position:absolute;
		top:0;
		right:0;
		text-align:center;
		height:100%;
		width:40%;
		background-color:#dd6264;
		color:#fff;
		line-height:80upx;
	}
	.otrs{
		background-color:#f3f3f3;
	}
</style>
